<template>
  <div class="grand-child">
    <h3>我是孙组件</h3>
    <h4>{{ money }}</h4>
    <h4>{{ car }}</h4>
    <button @click="updateMany(6)">修改爷爷的值</button>
  </div>
</template>

<script setup lang="ts" name="GrandChild">
import { inject } from 'vue';

//接受传递过来的值  { money: 0, updateMany: (x: number) => { } } 默认值
let { money, updateMany } = inject("money", { money: 0, updateMany: (x: number) => { } })
//{ brand: '未知', price: 0 } 默认值
let car = inject("car", { brand: '未知', price: 0 })
</script>

<style scoped>
.grand-child {
  background-color: orange;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 0 10px black;
}
</style>